<?php
/**
 * index.php 管理系统首页
 *
 * @version       v0.01
 * @create time   2016/11/16
 * @author        yc
 */

$LEFTMENU = 'index';
?>
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>后台管理系统首页</title>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
	<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css">
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
	<link rel="stylesheet" href="dist/css/AdminLTE.min.css">
	<link rel="stylesheet" href="dist/css/skins/_all-skins.min.css">
	<link rel="stylesheet" href="plugins/iCheck/flat/blue.css">
	<link rel="stylesheet" href="plugins/morris/morris.css">
	<link rel="stylesheet" href="plugins/datepicker/datepicker3.css">
	<link rel="stylesheet" href="plugins/daterangepicker/daterangepicker.css">
	<link rel="stylesheet" href="plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css">
</head>
<body class="hold-transition skin-blue sidebar-mini">

<div class="wrapper">
	<?php require_once('header.inc.php');?>
	<?php require_once('leftmenu.inc.php');?>
	<div class="content-wrapper">
		<section class="content-header">
			<h1>
				首页
				<small>分类概况</small>
			</h1>
			<ol class="breadcrumb">
				<li><a href="index.php"><i class="fa fa-dashboard"></i>首页</a></li>
			</ol>
		</section>

		<section class="content">
			<div class="row">
				<div class="col-lg-3 col-xs-6">
					<div class="small-box bg-aqua">
						<div class="inner">
							<h3>150</h3>
							<p>新订单</p>
						</div>
						<div class="icon"><i class="ion ion-bag"></i></div>
						<a href="#" class="small-box-footer">More info <i class="fa fa-arrow-circle-right"></i></a>
					</div>
				</div>
				<div class="col-lg-3 col-xs-6">
					<div class="small-box bg-green">
						<div class="inner">
							<h3>53</h3>
							<p>今日访问量</p>
						</div>
						<div class="icon"><i class="ion ion-stats-bars"></i></div>
						<a href="#" class="small-box-footer">More info <i class="fa fa-arrow-circle-right"></i></a>
					</div>
				</div>
				<div class="col-lg-3 col-xs-6">
					<div class="small-box bg-yellow">
						<div class="inner">
							<h3>44</h3>
							<p>新用户注册亮</p>
						</div>
						<div class="icon">
							<i class="ion ion-person-add"></i>
						</div>
						<a href="#" class="small-box-footer">More info <i class="fa fa-arrow-circle-right"></i></a>
					</div>
				</div>
				<!-- ./col -->
				<div class="col-lg-3 col-xs-6">
					<!-- small box -->
					<div class="small-box bg-red">
						<div class="inner">
							<h3>Undefined</h3>
							<p>Undetermined</p>
						</div>
						<div class="icon"><i class="ion ion-pie-graph"></i></div>
						<a href="#" class="small-box-footer">More info <i class="fa fa-arrow-circle-right"></i></a>
					</div>
				</div>
			</div>
			<div class="row">
				<section class="col-lg-7 connectedSortable">
					<!-- 待办事件 -->
					<div class="box box-primary">
						<div class="box-header">
							<i class="ion ion-clipboard"></i>
							<h3 class="box-title">待办事件</h3>
							<div class="box-tools pull-right">
								<ul class="pagination pagination-sm inline">
									<li><a href="#">&laquo;</a></li>
									<li><a href="#">1</a></li>
									<li><a href="#">2</a></li>
									<li><a href="#">3</a></li>
									<li><a href="#">&raquo;</a></li>
								</ul>
							</div>
						</div>
						<div class="box-body">
							<ul class="todo-list">
								<li>
									<span class="handle">
										<i class="fa fa-ellipsis-v"></i>
										<i class="fa fa-ellipsis-v"></i>
									</span>
									<input type="checkbox" value="">
									<span class="text">Design a nice theme</span>
									<small class="label label-danger"><i class="fa fa-clock-o"></i> 2 mins</small>
									<div class="tools">
										<i class="fa fa-edit"></i>
										<i class="fa fa-trash-o"></i>
									</div>
								</li>
								<li>
									<span class="handle">
										<i class="fa fa-ellipsis-v"></i>
										<i class="fa fa-ellipsis-v"></i>
									</span>
									<input type="checkbox" value="">
									<span class="text">Make the theme responsive</span>
									<small class="label label-info"><i class="fa fa-clock-o"></i> 4 hours</small>
									<div class="tools">
										<i class="fa fa-edit"></i>
										<i class="fa fa-trash-o"></i>
									</div>
								</li>
								<li>
									<span class="handle">
										<i class="fa fa-ellipsis-v"></i>
										<i class="fa fa-ellipsis-v"></i>
									</span>
									<input type="checkbox" value="">
									<span class="text">Let theme shine like a star</span>
									<small class="label label-warning"><i class="fa fa-clock-o"></i> 1 day</small>
									<div class="tools">
										<i class="fa fa-edit"></i>
										<i class="fa fa-trash-o"></i>
									</div>
								</li>
								<li>
									<span class="handle">
										<i class="fa fa-ellipsis-v"></i>
										<i class="fa fa-ellipsis-v"></i>
									</span>
									<input type="checkbox" value="">
									<span class="text">Let theme shine like a star</span>
									<small class="label label-success"><i class="fa fa-clock-o"></i> 3 days</small>
									<div class="tools">
										<i class="fa fa-edit"></i>
										<i class="fa fa-trash-o"></i>
									</div>
								</li>
								<li>
									<span class="handle">
										<i class="fa fa-ellipsis-v"></i>
										<i class="fa fa-ellipsis-v"></i>
									</span>
									<input type="checkbox" value="">
									<span class="text">Check your messages and notifications</span>
									<small class="label label-primary"><i class="fa fa-clock-o"></i> 1 week</small>
									<div class="tools">
										<i class="fa fa-edit"></i>
										<i class="fa fa-trash-o"></i>
									</div>
								</li>
								<li>
									<span class="handle">
										<i class="fa fa-ellipsis-v"></i>
										<i class="fa fa-ellipsis-v"></i>
									</span>
									<input type="checkbox" value="">
									<span class="text">Let theme shine like a star</span>
									<small class="label label-default"><i class="fa fa-clock-o"></i> 1 month</small>
									<div class="tools">
										<i class="fa fa-edit"></i>
										<i class="fa fa-trash-o"></i>
									</div>
								</li>
							</ul>
						</div>
						<!-- /.box-body -->
						<div class="box-footer clearfix no-border">
							<button type="button" class="btn btn-default pull-right"><i class="fa fa-plus"></i> Add item</button>
						</div>
					</div>
					<!-- 留言板 -->
					<div class="box box-success">
						<div class="box-header">
							<i class="fa fa-comments-o"></i>
							<h3 class="box-title">留言板</h3>
							<div class="box-tools pull-right" data-toggle="tooltip" title="Status">
								<div class="btn-group" data-toggle="btn-toggle">
									<button type="button" class="btn btn-default btn-sm active"><i class="fa fa-square text-green"></i></button>
									<button type="button" class="btn btn-default btn-sm"><i class="fa fa-square text-red"></i></button>
								</div>
							</div>
						</div>
						<div class="box-body chat" id="chat-box">
							<div class="item">
								<img src="dist/img/user4-128x128.jpg" alt="user image" class="online">
								<p class="message">
									<a href="#" class="name">
										<small class="text-muted pull-right"><i class="fa fa-clock-o"></i> 2:15</small>
										Mike Doe
									</a>
									I would like to meet you to discuss the latest news about
									the arrival of the new theme. They say it is going to be one the
									best themes on the market
								</p>
								<div class="attachment">
									<h4>Attachments:</h4>
									<p class="filename">Theme-thumbnail-image.jpg</p>
									<div class="pull-right">
										<button type="button" class="btn btn-primary btn-sm btn-flat">Open</button>
									</div>
								</div>
							</div>
							<div class="item">
								<img src="dist/img/user3-128x128.jpg" alt="user image" class="offline">
								<p class="message">
									<a href="#" class="name">
										<small class="text-muted pull-right"><i class="fa fa-clock-o"></i> 5:15</small>
										Alexander Pierce
									</a>
									I would like to meet you to discuss the latest news about
									the arrival of the new theme. They say it is going to be one the
									best themes on the market
								</p>
							</div>
							<div class="item">
								<img src="dist/img/user2-160x160.jpg" alt="user image" class="offline">
								<p class="message">
									<a href="#" class="name">
										<small class="text-muted pull-right"><i class="fa fa-clock-o"></i> 5:30</small>
										Susan Doe
									</a>
									I would like to meet you to discuss the latest news about
									the arrival of the new theme. They say it is going to be one the
									best themes on the market
								</p>
							</div>
						</div>
						<div class="box-footer">
							<div class="input-group">
								<input class="form-control" placeholder="Type message...">

								<div class="input-group-btn">
									<button type="button" class="btn btn-success"><i class="fa fa-plus"></i></button>
								</div>
							</div>
						</div>
					</div>


					<div class="nav-tabs-custom">
						<ul class="nav nav-tabs pull-right">
							<li class="active"><a href="#revenue-chart" data-toggle="tab">Area</a></li>
							<li><a href="#sales-chart" data-toggle="tab">Donut</a></li>
							<li class="pull-left header"><i class="fa fa-inbox"></i> Sales</li>
						</ul>
						<div class="tab-content no-padding">
							<div class="chart tab-pane active" id="revenue-chart" style="position: relative; height: 300px;"></div>
							<div class="chart tab-pane" id="sales-chart" style="position: relative; height: 300px;"></div>
						</div>
					</div>
					
					


					<!-- quick email widget -->
					<div class="box box-info">
						<div class="box-header">
							<i class="fa fa-envelope"></i>

							<h3 class="box-title">Quick Email</h3>
							<!-- tools box -->
							<div class="pull-right box-tools">
								<button type="button" class="btn btn-info btn-sm" data-widget="remove" data-toggle="tooltip" title="Remove">
									<i class="fa fa-times"></i></button>
							</div>
							<!-- /. tools -->
						</div>
						<div class="box-body">
							<form action="#" method="post">
								<div class="form-group">
									<input type="email" class="form-control" name="emailto" placeholder="Email to:">
								</div>
								<div class="form-group">
									<input type="text" class="form-control" name="subject" placeholder="Subject">
								</div>
								<div>
									<textarea class="textarea" placeholder="Message" style="width: 100%; height: 125px; font-size: 14px; line-height: 18px; border: 1px solid #dddddd; padding: 10px;"></textarea>
								</div>
							</form>
						</div>
						<div class="box-footer clearfix">
							<button type="button" class="pull-right btn btn-default" id="sendEmail">Send
								<i class="fa fa-arrow-circle-right"></i></button>
						</div>
					</div>

				</section>
				<!-- /.Left col -->
				<!-- right col (We are only adding the ID to make the widgets sortable)-->
				<section class="col-lg-5 connectedSortable">
					<!-- 日历 -->
					<div class="box box-solid bg-green-gradient">
						<div class="box-header">
							<i class="fa fa-calendar"></i>
							<h3 class="box-title">日历</h3>
							<div class="pull-right box-tools">
								<div class="btn-group">
									<button type="button" class="btn btn-success btn-sm dropdown-toggle" data-toggle="dropdown">
										<i class="fa fa-bars"></i></button>
									<ul class="dropdown-menu pull-right" role="menu">
										<li><a href="#">Add new event</a></li>
										<li><a href="#">Clear events</a></li>
										<li class="divider"></li>
										<li><a href="#">View calendar</a></li>
									</ul>
								</div>
								<button type="button" class="btn btn-success btn-sm" data-widget="collapse"><i class="fa fa-minus"></i>
								</button>
								<button type="button" class="btn btn-success btn-sm" data-widget="remove"><i class="fa fa-times"></i>
								</button>
							</div>
						</div>
						<div class="box-body no-padding">
							<div id="calendar" style="width: 100%"></div>
						</div>
						<div class="box-footer text-black">
							<div class="row">
								<div class="col-sm-6">
									<div class="clearfix">
										<span class="pull-left">Task #1</span>
										<small class="pull-right">90%</small>
									</div>
									<div class="progress xs">
										<div class="progress-bar progress-bar-green" style="width: 90%;"></div>
									</div>
									<div class="clearfix">
										<span class="pull-left">Task #2</span>
										<small class="pull-right">70%</small>
									</div>
									<div class="progress xs">
										<div class="progress-bar progress-bar-green" style="width: 70%;"></div>
									</div>
								</div>
								<div class="col-sm-6">
									<div class="clearfix">
										<span class="pull-left">Task #3</span>
										<small class="pull-right">60%</small>
									</div>
									<div class="progress xs">
										<div class="progress-bar progress-bar-green" style="width: 60%;"></div>
									</div>

									<div class="clearfix">
										<span class="pull-left">Task #4</span>
										<small class="pull-right">40%</small>
									</div>
									<div class="progress xs">
										<div class="progress-bar progress-bar-green" style="width: 40%;"></div>
									</div>
								</div>
							</div>
						</div>
					</div>
					<!-- Map box -->
					<div class="box box-solid bg-light-blue-gradient">
						<div class="box-header">
							<!-- tools box -->
							<div class="pull-right box-tools">
								<button type="button" class="btn btn-primary btn-sm daterange pull-right" data-toggle="tooltip" title="Date range">
									<i class="fa fa-calendar"></i></button>
								<button type="button" class="btn btn-primary btn-sm pull-right" data-widget="collapse" data-toggle="tooltip" title="Collapse" style="margin-right: 5px;">
									<i class="fa fa-minus"></i></button>
							</div>
							<!-- /. tools -->

							<i class="fa fa-map-marker"></i>

							<h3 class="box-title">
								Visitors
							</h3>
						</div>
						<div class="box-body">
							<div id="world-map" style="height: 250px; width: 100%;"></div>
						</div>
						<!-- /.box-body-->
						<div class="box-footer no-border">
							<div class="row">
								<div class="col-xs-4 text-center" style="border-right: 1px solid #f4f4f4">
									<div id="sparkline-1"></div>
									<div class="knob-label">Visitors</div>
								</div>
								<!-- ./col -->
								<div class="col-xs-4 text-center" style="border-right: 1px solid #f4f4f4">
									<div id="sparkline-2"></div>
									<div class="knob-label">Online</div>
								</div>
								<!-- ./col -->
								<div class="col-xs-4 text-center">
									<div id="sparkline-3"></div>
									<div class="knob-label">Exists</div>
								</div>
								<!-- ./col -->
							</div>
							<!-- /.row -->
						</div>
					</div>
					<!-- /.box -->

					<!-- solid sales graph -->
					<div class="box box-solid bg-teal-gradient">
						<div class="box-header">
							<i class="fa fa-th"></i>

							<h3 class="box-title">Sales Graph</h3>

							<div class="box-tools pull-right">
								<button type="button" class="btn bg-teal btn-sm" data-widget="collapse"><i class="fa fa-minus"></i>
								</button>
								<button type="button" class="btn bg-teal btn-sm" data-widget="remove"><i class="fa fa-times"></i>
								</button>
							</div>
						</div>
						<div class="box-body border-radius-none">
							<div class="chart" id="line-chart" style="height: 250px;"></div>
						</div>
						<!-- /.box-body -->
						<div class="box-footer no-border">
							<div class="row">
								<div class="col-xs-4 text-center" style="border-right: 1px solid #f4f4f4">
									<input type="text" class="knob" data-readonly="true" value="20" data-width="60" data-height="60" data-fgColor="#39CCCC">

									<div class="knob-label">Mail-Orders</div>
								</div>
								<!-- ./col -->
								<div class="col-xs-4 text-center" style="border-right: 1px solid #f4f4f4">
									<input type="text" class="knob" data-readonly="true" value="50" data-width="60" data-height="60" data-fgColor="#39CCCC">

									<div class="knob-label">Online</div>
								</div>
								<!-- ./col -->
								<div class="col-xs-4 text-center">
									<input type="text" class="knob" data-readonly="true" value="30" data-width="60" data-height="60" data-fgColor="#39CCCC">

									<div class="knob-label">In-Store</div>
								</div>
								<!-- ./col -->
							</div>
							<!-- /.row -->
						</div>
						<!-- /.box-footer -->
					</div>
					<!-- /.box -->

					

				</section>
				<!-- right col -->
			</div>
			<!-- /.row (main row) -->

		</section>
		<!-- /.content -->
	</div>
	<?php require_once('footer.inc.php');?>
	<!-- <div class="control-sidebar-bg"></div> -->
</div>

<script src="plugins/jQuery/jquery-2.2.3.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
<script>
	$.widget.bridge('uibutton', $.ui.button);
</script>
<script src="bootstrap/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
<script src="plugins/morris/morris.min.js"></script>
<script src="plugins/sparkline/jquery.sparkline.min.js"></script>
<script src="plugins/jvectormap/jquery-jvectormap-1.2.2.min.js"></script>
<script src="plugins/jvectormap/jquery-jvectormap-world-mill-en.js"></script>
<script src="plugins/knob/jquery.knob.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.11.2/moment.min.js"></script>
<script src="plugins/daterangepicker/daterangepicker.js"></script>
<script src="plugins/datepicker/bootstrap-datepicker.js"></script>
<script src="plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js"></script>
<script src="plugins/slimScroll/jquery.slimscroll.min.js"></script>
<script src="plugins/fastclick/fastclick.js"></script>
<script src="dist/js/app.min.js"></script>
<script src="dist/js/pages/dashboard.js"></script>
</body>
</html>
